<template>
	<loading v-if="isLoading" style="height: 70vh;"></loading>
	<view v-else>
		<tn-form :model="delivery_config" ref="formRef" :rules="config_formRules" label-position="top">
			<tn-form-item label="服务费率（千分比）" prop="delivery_cash_rate">
				<tn-input type="digit" v-model="delivery_config.delivery_cash_rate" placeholder="配送商结算申请额外的的服务费率"
					clearable />
			</tn-form-item>
		</tn-form>
		<view class="tn-flex-center">
			<tn-button size="lg" width="80vw" height="80" font-size="26" @click="deliveryConfigBlur">确定修改</tn-button>
		</view>
	</view>
</template>

<script setup>
	import {
		onMounted,
		ref,
	} from 'vue'
	import {
		getconfigItemApi
	} from "@/request/worktop/index.js"

	onMounted(() => {
		delivery_config.value.id = props.userId
		getconfigItem()
	})

	const props = defineProps(['userId'])

	const isLoading = ref(true)
	const delivery_config = ref({
		id: 0,
		delivery_cash_rate: 0
	})

	// 服务费规则
	const config_formRules = {
		delivery_cash_rate: [{
			required: true,
			message: '请输入服务费率',
			trigger: ['change', 'blur']
		}]
	}

	// 获取服务费率
	const getconfigItem = (type = '') => {
		getconfigItemApi(delivery_config.value, type).then(res => {
			if (res.code == 0) {
				delivery_config.value.delivery_cash_rate = res.data.delivery_cash_rate
			}
		}).catch(err => {
			uni.showToast({
				title: err.message,
				icon: 'none'
			})
		}).finally(() => {
			setTimeout(() => {
				isLoading.value = false
			}, 500)
		})
	}
	// 修改服务费率
	const deliveryConfigBlur = () => {
		getconfigItemApi(delivery_config.value, 'edit').then(res => {
			if (res.code == 0) {
				uni.showToast({
					title: res.message
				})
			}
		}).catch(err => {
			uni.showToast({
				title: err.message,
				icon: 'none'
			})
		})
	}
</script>

<style scoped lang="scss">
</style>